<admintpl file="header1"/>
 </head>
<body>
	<div class="wrap">
		<ul class="nav nav-tabs">
			<li><a href="{:U('menu/index')}">tab1</a></li>
			<li class="active"><a href="{:U('menu/add')}">tab2</a></li>
		</ul>
		<form method="post" class="form-horizontal js-ajax-form" action="{:U('Menu/add_post')}">
			<fieldset>
				<div class="control-group">
					<label class="control-label">单选下拉</label>
					<div class="controls">
						<select name="parentid">
							<option value="0">作为一级菜单</option>
							<option value="1">作为二级菜单</option>
							<option value="2">作为三级菜单</option>
						</select>
					</div>
				</div>
				<div class="control-group">
					<label class="control-label">多选下拉</label>
					<div class="controls">
						<select name="parentid" multiple="multiple">
							<option value="1">苹果</option>
							<option value="2">苹果1</option>
							<option value="3">苹果2</option>
						</select>
					</div>
				</div>
				
				<div class="control-group">
					<label class="control-label">选择省份</label>
					<div class="controls">
						<select class="default"  id="province" name="province">
				   	      	   <option>----请选择省份----</option> 
						       <option>北京</option> 
						       <option>上海</option> 
						       <option>江苏</option> 
						</select>
					</div>
				</div>
				<input type="hidden" name="city" id="city" value=""/>
				<div class="control-group">
					<label class="control-label">选择城市</label>
					<div class="controls">
							<select class="city"> 
						   	<option>----请选择城市----</option> 
						    </select> 
						    <select class="city"> 
						       <option>东城</option> 
						       <option>西城</option> 
						       <option>崇文</option> 
						       <option>宣武</option> 
						       <option>朝阳</option> 
						   </select>  
						   <select class="city"> 
						       <option>黄浦</option> 
						       <option>卢湾</option> 
						       <option>徐汇</option> 
						       <option>长宁</option> 
						       <option>静安</option> 
						   </select> 
						   <select class="city"> 
						       <option>南京</option> 
						       <option>镇江</option> 
						       <option>苏州</option> 
						       <option>南通</option> 
						       <option>扬州</option> 
						   </select> 
					</div>
				</div>
				
				<div class="control-group">
					<label class="control-label">搜索下拉</label>
					<div class="controls">
						    <select id="id_select" class="selectpicker bla bla bli"  data-live-search="true">
					        <option>cow1</option>
					        <option>bull2</option>
					        <option>bull86</option>
					        <option class="get-class" disabled>ox</option>
					        <optgroup label="test" data-subtext="another test" data-icon="icon-ok">
					            <option>ASD</option>
					            <option selected>Bla</option>
					            <option>Ble</option>
					        </optgroup>
					    </select>
					</div>
				</div>
				<div class="control-group">
					<label class="control-label">多选搜索下拉</label>
					<div class="controls">
						    <select id="id_select" class="selectpicker bla bla bli" multiple  data-live-search="true">
					        <option>cow1</option>
					        <option>bull2</option>
					        <option>bull86</option>
					        <option class="get-class" disabled>ox</option>
					        <optgroup label="test" data-subtext="another test" data-icon="icon-ok">
					            <option>ASD</option>
					            <option selected>Bla</option>
					            <option>Ble</option>
					        </optgroup>
					    </select>
					</div>
				</div>
				<div class="control-group">
					<label class="control-label">文本:</label>
					<div class="controls">
						<input type="text" name="name">
						<span class="form-required">*</span>
					</div>
				</div>
				<div class="control-group">
					<label class="control-label">备注:</label>
					<div class="controls">
						<textarea name="remark" rows="5" cols="57" style="width: 500px;"></textarea>
					</div>
				</div>
				<div class="control-group">
					<label class="control-label">日期</label>
					<div class="controls">
						<input type="text" name="date" class="js-date" />
					</div>
				</div>
				<div class="control-group">
					<label class="control-label">日期&时间</label>
					<div class="controls">
						<input type="text" name="time" class="js-datetime" />
					</div>
				</div>
				<div class="control-group">
					<label class="control-label">时间</label>
					<div class="controls">
						<input type="text" name="time" class="js-time" />
					</div>
				</div>
				<div class="control-group">
					<label class="control-label">金钱</label>
					<div class="controls">
						<div class="input-prepend input-append">
							<span class="add-on">
				                <label class="checkbox">
				                  <input class="" type="checkbox">
				                </label>
              				</span>
							<input class="span2" placeholder="placeholder" type="text">
						</div>
					</div>
				</div>
			  <div class="control-group">
			  	<label class="control-label">金额</label>
			  	<div class="controls">
			  		<div class="input-prepend input-append">
			  		<span class="add-on">$</span>
			  		<input class="span2" placeholder="placeholder" type="text" />
			  		<span class="add-on">.00</span>
			  		</div>
			  	</div>
			  </div>	
			  
			  <div class="control-group">
			  	<label class=" control-label">slider</label>
			  	<div class="controls">
			  		<div class="input-prepend input-append">
			  		<input id="ex6" type="text" class="span2" data-slider-id="GC"  data-slider-handle="round" data-slider-id='ex1Slider'  data-slider-min="-5" data-slider-max="20" data-slider-step="1" data-slider-value="3"/>
                    <span id="ex6CurrentSliderValLabel" class="add-on" style="margin-left: 10px;"> <span id="ex6SliderVal">3</span></span>
                    </div>	
			  		</div>
			  	</div>
			  	
			  	<div class="control-group">
			  	<label class=" control-label">slider</label>
			  	<div class="controls">
			  		<input type="number" class="form-control"/>
			  		</div>
			  	</div>
			  	</fieldset>
			</form>
			<div class="form-actions">
				<button type="submit" class="btn btn-primary js-ajax-submit">{:L('ADD')}</button>
				<a class="btn" href="{:U('menu/index')}">{:L('BACK')}</a>
			</div>
	</div>
	<script src="__PUBLIC__/js/common.js"></script>
	<script>
		var currentShowCity=0;
		$(document).ready(function(){
		   $("#province").change(function(){
			   $("#province option").each(function(i,o){
				   if($(this)[0].selected)
				   {
					   $(".city").hide();
					   $(".city").eq(i).show();
					   $("#city").val($(".city").eq(i).find("option:selected").text());
					   currentShowCity=i;
				   }
			   });
		   });
		   $("#province").change();
		});
		 $(".city").change(function(){
		 	 $(".city").each(function(i,o){
			if(i == currentShowCity){
					$("#city").val($(".city").eq(i).val());
				 }
		   });
		 });
	</script>
	 <script type="text/javascript">
        $(window).on('load', function () {
            $('.selectpicker').selectpicker({
               // 'selectedText': 'cat'
            });
            $("#ex6").slider({
            	tooltip: 'always'
            });
			$("#ex6").on("slide", function(slideEvt) {
				$("#ex6SliderVal").text(slideEvt.value);
			});
            // $('.selectpicker').selectpicker('hide');
        });
    </script>
</body>
</html>